<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/component/commonTagLib.jsp" %>

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>项目时间阶段设置</title>
	<%@ include file="/WEB-INF/component/commonCSS.jsp" %> 
	<style type="text/css"> 
		div.box-body { 
			background:url('${ctx}/lib/img/timerbackground.png') no-repeat fixed right;
			min-height: 300px;
		}
		div.timeBox {
            width: 620px;
            height: 120px;
            position: relative;
            z-index: 1;
		}
		div.topBox {
		    margin-bottom: 10px;
		    background:url('${ctx}/lib/img/projectTime/top.png') no-repeat 306px 55px;
		}
		input.timeInput {
            width: 135px;
		}
		span.blue {
		    font-weight: bold;
		    color: #3c8dbc;
		}
		span.red {
		    font-weight: bold;
		    color: #dd4b39;
		}
		div.topLabel {
		    text-align: center;
		    margin-top: 0px;
		}
		div.topDiv {
		    text-align: center;
            margin-top: 10px;
		}
		div.leftBox {
		    width: 330px;
		    margin-top: -72px;
		    background:url('${ctx}/lib/img/projectTime/left.png') no-repeat 107px 0px;
		}
		div.leftIcon {
            position: absolute;
            left: 20px;
            top: 0px;
            width: 71px;
            height: 71px;
            background:url('${ctx}/lib/img/projectTime/appealStarttime.png') no-repeat;
        }
		div.leftLabel {
		    position: absolute;
            left: 120px;
            top: 15px;
            width: 180px;
            height: 35px;
            text-align: center;
		}
		div.leftDiv {
		    position: absolute;
            left: 120px;
            top: 50px;
            width: 180px;
            height: 35px;
            text-align: center;
		}
		div.on-off {
		    position: absolute;
            left: 185px;
            top: 80px;
            width: 48px;
            height: 22px;
            cursor: pointer;
		}
		div.all-on-off {
		    position: absolute;
            left: 385px;
            top: 29px;
            width: 48px;
            height: 22px;
            cursor: pointer;
		}
		div.off {
		    background:url('${ctx}/lib/img/projectTime/end.png') no-repeat;
		}
		div.on {
            background:url('${ctx}/lib/img/projectTime/start.png') no-repeat;
        }
		div.rightBox {
		    width: 330px;
		    margin-left: 290px;
		    margin-top: -72px;
            background:url('${ctx}/lib/img/projectTime/right.png') no-repeat 11px 0px;
        }
        div.rightIcon {
            position: absolute;
            left: 240px;
            top: 0px;
            width: 71px;
            height: 71px;
            background:url('${ctx}/lib/img/projectTime/appealEndtime.png') no-repeat;
        }
        div.rightLabel {
            position: absolute;
            left: 30px;
            top: 15px;
            width: 180px;
            height: 35px;
            text-align: center;
        }
        div.rightDiv {
            position: absolute;
            left: 30px;
            top: 50px;
            width: 180px;
            height: 35px;
            text-align: center;
        }
        div.bottomBox {
            z-index: 0;
            margin-top: -72px;
            padding-top: 48px;
            background:url('${ctx}/lib/img/projectTime/bottom.png') no-repeat 306px 0px;
        }
        div.bottomLabel {
            text-align: center;
        }
        div.bottomDiv {
            text-align: center;
            margin-top: 10px;
        }
        div.text-center {
            width: 620px;
            margin: 0px 0px 30px 0px;
        }
        div.leftCursor, div.rightCursor {
            width: 18px;
            height: 16px;
            position: absolute;
            top: 32px;
        }
        div.leftCursor {
            left: 300px;
        }
        div.rightCursor {
            left: 10px;
        }
	</style>
	<%@ include file="/WEB-INF/component/commonJS.jsp" %> 
</head>
<body class="skin-blue-light sidebar-mini fixed skin-blue-light-frame">
    
    <section class="content-header">
		<h1>招标项目时间段查看</h1>
		<ol class="breadcrumb">
			<li><a href="${ctx}/home.jsp"><i class="fa fa-home"></i>首页</a></li>
			<li class="active">药品招标管理</li>
			<li class="active">采购项目管理</li>
			<li class="active">项目时间阶段查看</li>
		</ol> 
    </section>
    
    <section class="content">
		<div class=" box box-success">
			<form id="form" action="${ctx}/bidProject/setProjTime.html" method="post">
				<input type="hidden" id="projId" name="projId" value="${projId}">
				<div class="box-header with-border">
<h3 class="box-title">${name }</h3>

</div>
				<div class="box-body">
                    <div class="timeBox topBox">
                        <div class="topLabel">项目<span class="blue">开始</span>日期</div>
                        <div class="topDiv">
                        		${projStart.timeValue }
                        </div>
                    </div>
                    <input type="hidden" name="curStatus" id="curStatus" value="">
                    <c:forEach items="${info }" var="list" varStatus="vs">
                            <c:choose>
                            	<c:when test="${vs.count % 2 == 1 }">
			                        <div class="timeBox leftBox">
			                        <div class="leftIcon" style="background:url('${ctx}/lib/img/projectTime/${list.idName }.png') no-repeat;"></div>
			                        <div class="leftLabel">${fn:substringBefore(list.timeName,"开始") }<span class="blue">开始</span>${fn:substringAfter(list.timeName,"开始") }</div>
			                        <div class="leftDiv">
			                        		${list.timeValue }
			                        </div>
			                        <div class="leftCursor"></div>
			                        <c:if test="${! projStart.nowStatus }">
			                        <c:if test="${list.nowStatus }">
				                        	<script type="text/javascript">
				                        	   $("#curStatus").val('${list.curStatus}');
				                        	   $(".leftCursor").css("background","url('${ctx}/lib/img/timer.png') no-repeat");
				                        	   $(".rightCursor").css("background","url('${ctx}/lib/img/timer.png') no-repeat");
				                        	</script>
				                       </c:if>
			                        </c:if>
			                    	</div>
                            	</c:when>
                            	<c:otherwise>
			                        <div class="timeBox rightBox">
			                        <div class="rightIcon" style="background:url('${ctx}/lib/img/projectTime/${list.idName }.png') no-repeat;"></div>
			                        <div class="rightLabel">${fn:substringBefore(list.timeName,"结束") }<span class="red">结束</span>${fn:substringAfter(list.timeName,"结束") }</div>
			                        <div class="rightDiv">
			                        		${list.timeValue }
			                        </div>
			                        <div class="rightCursor"></div>
			                        </div>
                            	</c:otherwise>
                            </c:choose>
                     </c:forEach>
                     
                    <div class="timeBox bottomBox">
                        <div class="bottomLabel">项目<span class="red">结束</span>日期</div>
                        <div class="bottomDiv">
			                        		${projEnd.timeValue }
                        </div>
                    </div>
                    <c:if test="${empty defalutProjId }">
	                    <div class="box-footer text-center">
	                   		<a href="${ctx}/prodProject/toProjectListTimeSee.html" class="btn btn-danger btn-sm　">返&nbsp;回</a>
	                	</div>
               </c:if>
				</div>
			</form>
		</div>
    </section>
    

</body>
</html>










